<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="content-type" content="text/html;charset=UTF-8">
    <title>Title</title>
</head>
<body>
    <div style="width: 600px;margin: 0 auto">
        <input type="text" value="请输入关键字" id="i1" onfocus="Focus();" onblur="Blur();">   <!--还可以用于搜索提示-->
        <input type="text" placeholder="亲输入关键字">    <!--新版的使用input的placeholder关键字可以实现-->
    </div>

    <script>
        function Focus() {
            var tag = document.getElementById('i1');
            var val = tag.value;
            if(val =='请输入关键字'){
                tag.value = "";
            }
        }
        function Blur() {
            var tag = document.getElementById('i1');
            var val = tag.value;
            if(val.length == 0){
                tag.value = '请输入关键字';
            }
        }
    </script>

</body>
</html>